<template>
	<view class="manage">
		<view class="user">
			<view class="img">
				<view class="image">
					<image src="../../static/img/userface/20.jpg"></image>
				</view>
				<text>个人信息</text>
				<u-icon name="arrow-right" size="20"></u-icon>
			</view>
			<u-line length="100%"></u-line>
			<view class="addr" @click="goAddr()">
				<view>
					<text>收货地址</text>
				</view>
				<view>
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
			</view>
		</view>
		<view class="pwd">
			<view class="p1" @click="goUpdatePwd()">
				<view>
					<text>修改密码</text>
				</view>
				<view>
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
			</view>
		</view>
		<view class="ul">
			<view class="li">
				<view>
					<text>允许个性化推荐</text>
				</view>
				<view>
					<u-switch v-model="value1" active-color="#13ce66" size="22" ></u-switch>
				</view>
			</view>
			<view class="li">
				<view>
					<text>允许推送通知</text>
				</view>
				<view>
					<u-switch v-model="value2" active-color="#13ce66" size="22" ></u-switch>
				</view>
			</view>
			<view class="li">
				<view>
					<text>清除缓存</text>
				</view>
				<view>
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
			</view>
			<view class="li">
				<view>
					<text>意见反馈</text>
				</view>
				<view>
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
			</view>
			<view class="li">
				<view>
					<text>个人信息清单</text>
				</view>
				<view>
					<u-icon name="arrow-right" size="20"></u-icon>
				</view>
			</view>
		</view>
		<view class="log">
			<u-button @click="goLogin()">切换密码</u-button>
		</view>
		<view class="log">
			<u-button @click="logout()">退出登录</u-button>
		</view>
	</view>
</template>

<script>
import { mapActions,mapState } from 'vuex';
	export default {
		data() {
			return {
				value1 : true,
				value2 : true,
			}
		},
		computed:{
			...mapState('login',['users','log'])
		},
		methods: {
			...mapActions('login',['actionEnrollList','actionLogin']),
			goAddr(){
				if(this.log.account==''){
					setTimeout(()=>{
						uni.showToast({
							icon:'none',
							title:'请先登录！'
						})
					},200)
					uni.navigateTo({
						url:'/pages/login/login'
					})
				}else{
					uni.navigateTo({
						url:'/pages/addrlist/addrlist'
					})
				}
			},
			goUpdatePwd(){
				setTimeout(()=>{
					uni.showToast({
						icon:'none',
						title:'请先登录！'
					})
				},200)
				if(this.log.account==''){
					uni.navigateTo({
						url:'/pages/login/login'
					})
				}else{
					uni.navigateTo({
						url:'/pages/updatepwd/updatepwd'
					})
				}
			},
			goLogin(){
				this.actionLogin({
					account : '',
					phone : '',
					pwd : '',
					addr : ''
				})
				uni.navigateTo({
					url:'/pages/login/login'
				})
			},
			logout(){
				console.log(this.log);
				this.actionLogin({
					account : '',
					phone : '',
					pwd : '',
					addr : ''
				})
			}
		}
	}
</script>

<style>
.manage{
	width: 100%;
	background-color: #f8f8f8;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
.user{
	width: 100%;
	margin: 10px auto;
	border-radius: 6px;
	background-color: white;
	padding-bottom: 5px;
}
.user .img{
	width: 96%;
	margin: 0 auto;
	padding: 10px;
	display: flex;
	align-items: center;
}
.user .image{
	width: 70px;
	height: 70px;
}
.user .image image{
	width: 100%;
	height: 100%;
	border-radius: 50%;
}
.user .img text{
	width: 70%;
	font-size: 19px;
	margin-left: 11px;
}
.user .addr{
	width: 94%;
	margin: 10px auto;
	font-size: 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.pwd{
	width: 100%;
	background-color: white;
	border-radius: 6px;
}
.pwd .p1{
	width: 94%;
	margin: 10px auto;
	padding: 10px;
	font-size: 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.ul{
	width: 100%;
	background-color: white;
	border-radius: 6px;
	padding-bottom: 10px;
}
.li{
	width: 94%;
	margin: 10px auto;
	padding: 10px;
	font-size: 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.log{
	width: 100%;
	background-color: white;
	margin-top: 10px;
}
.log .u-button{
	font-size: 16px;
	border-radius: 4px;
	letter-spacing: 1px;
}
</style>
